<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>编辑捐赠物品分配</title>
	<#include "/common/resource.ftl">
	<script type="text/javascript">
		$(function () {
			<#if (params.id)??>
				$.ajaxRequest({
					url: '${params.contextPath}/web/donationAssignment/query.json',
					data: {id: "${params.id}"},
					success: function (data) {
						if (!data.success) {
							$.message(data.message);
							return;
						}
						var record = data.data;
						for (var key in record) {
							$("[name='" + key + "']").val(record[key]);
						}
                        $("[name='happenDate']").val(record.happenDateStr);

                        if (record.donationAssignmentItemList) {
                            var donationAssignmentItemList = record.donationAssignmentItemList, strs = "";
                            for (var i = 0; i < donationAssignmentItemList.length; i ++) {
                                var item = donationAssignmentItemList[i];
                                item.index = i;
                                var str =  '<tr>\
                                <td><input type="text" name="donationAssignmentItemList[{index}].name" value="{name}" class="layui-input"/>\
                                <input type="hidden" name="donationAssignmentItemList[{index}].exists" value="1">\
                                </td>\
                                <td><input type="text" name="donationAssignmentItemList[{index}].quantity" value="{quantity}" class="layui-input"/></td>\
                                <td><input type="text" name="donationAssignmentItemList[{index}].evaluate" value="{evaluate}" class="layui-input"/></td>\
                                <td><div class="layui-form-mid layui-word-aux good-remove"><i class="layui-icon">&#xe640;</i></div></td>\
                                </tr>';
                                str = str.format(item);
                                strs += str;
                            }
                            $('[name="maxGoodNum"]').val(donationAssignmentItemList.length);
                            $(".good-table tbody").html(strs);
                        }
                        $('select[name="type"]').change();
					}
				});
			</#if>

            $("#add-good-button").click(function () {
                var maxGoodNum = parseInt($('[name="maxGoodNum"]').val());
                maxGoodNum ++;
                $('[name="maxGoodNum"]').val(maxGoodNum);

                var str = '<tr>\
                    <td><input type="text" name="donationAssignmentItemList[{0}].name" class="layui-input"/>\
                    <input type="hidden" name="donationAssignmentItemList[{0}].exists" value="1">\
                    </td>\
                    <td><input type="text" name="donationAssignmentItemList[{0}].quantity" class="layui-input"/></td>\
                    <td><input type="text" name="donationAssignmentItemList[{0}].evaluate" class="layui-input"/></td>\
                    <td><div class="layui-form-mid layui-word-aux good-remove"><i class="layui-icon">&#xe640;</i></div></td>\
                    </tr>';
                str = str.format(maxGoodNum);
                $(".good-table tbody").append(str);
            });

            $(".good-table").on("click", ".good-remove", function () {
                $(this).parent().parent().remove();
            });

            $('select[name="type"]').change(function () {
                var value = $(this).val();
                if (!value) {
                    $(".amount-item").show();
                    $(".good-card").show();
                    return;
                }
                if (value == 1) {
                    $(".amount-item").show();
                    $(".good-card").hide();
                    return;
                }
                $(".amount-item").hide();
                $(".good-card").show();
            });
		});
	</script>
    <style>
        .layui-word-aux{border:1px solid #FF5722;width:25px;height:25px;border-radius:50%;cursor:pointer;color:#FF5722 !important;text-align:center;padding:0px !important;line-height: 25px;}
    </style>
</head>
<body>
<body style="background:#eee;">
<div style="padding:10px;padding-top:0px;">
	<div class="ui-form">
		<form class="layui-form ajax-form" action="${params.contextPath}/web/donationAssignment/<#if (params.id)??>modify<#else>save</#if>.json" method="post">
			<input type="hidden" name="id" value="${params.id}" />
            <div class="layui-card">
                <div class="layui-card-header">基本信息</div>
                <div class="layui-card-body">
                    <div class="layui-form-item">
                        <label class="layui-form-label">日期<span class="ui-request">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="happenDate" placeholder="请输入日期" class="layui-input ui-date" readonly/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">接受部门<span class="ui-request">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="dept" placeholder="请输入接受部门" class="layui-input"/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">类型<span class="ui-request">*</span></label>
                        <div class="layui-input-block">
                            <select name="type" class="layui-input">
                                <option value="">请选择</option>
                                <option value="1">钱款</option>
                                <option value="2">物品</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item amount-item">
                        <label class="layui-form-label">金额<span class="ui-request">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="amount" placeholder="请输入金额" class="layui-input"/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">经办人<span class="ui-request">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="handleName" placeholder="请输入经办人" class="layui-input"/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">老人代表</label>
                        <div class="layui-input-block">
                            <input type="text" name="elderName" placeholder="请输入老人代表" class="layui-input"/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">备注</label>
                        <div class="layui-input-block">
                            <textarea name="remark" placeholder="请输入备注" class="layui-textarea"></textarea>
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-card good-card">
                <div class="layui-card-header">物品信息
                    <button type="button" id="add-good-button" class="layui-btn layui-btn-sm layui-btn-normal layui-btn-radius" style="float:right;display:inline-block;margin-top:8px;">
                        <i class="layui-icon">&#xe608;</i> 添加物品
                    </button>
                    <input type="hidden" name="maxGoodNum" value="0">
                </div>
                <div class="layui-card-body">
                    <table class="layui-table good-table" lay-size="sm">
                        <thead>
                        <tr>
                            <th>物品名称</th>
                            <th>数量</th>
                            <th>估价</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>
            </div>

			<div class="layui-form-item">
				<div class="layui-input-block">
					<input type="submit" value="保存" class="layui-btn" />
				</div>
			</div>
		</form>
	</div>
</div>
</body>

</html>
